{% comment %}Check if the user is logged in before displaying.{% endcomment %}
{%if User.Identity.Name != null%}
<div {%if Model.Id != null%}id="{{ Model.Id }}"{%endif%} class="{{ Model.Classes | join: " " | default: "ml-2" }}">
  <div class="d-flex">
    <div class="icon-col">
      <i class="fas fa-user"></i>
    </div>
    <div class="col mt-2">
      <input id="account-name" type="text" name="account-name" class="form-control" placeholder="{{"Your username" | t}}" aria-label="{{"Username" | t}}" value="{{User.Identity.Name}}" disabled />
    </div>
  </div>
  <div class="d-flex">
    <div class="icon-col">
      <i class="fas fa-envelope"></i>
    </div>
    <div class="col mt-2">
      <input id="account-email" type="email" name="account-email" class="form-control" placeholder="{{"Your email" | t}}" aria-label="{{"Email" | t}}" value="{{User | user_email }}" disabled />
    </div>
  </div>
  <div class="d-flex mt-2">
    <div class="icon-col"></div>
    <div class="col d-flex justify-content-md-start justify-content-end">
      <a href="{{"~/changepassword" | href}}" class="btn btn-primary btn-sm mb-">
        <span>{{"Change password" | t}}</span>
      </a>
    </div>
  </div>
</div>
{%endif%}